html {
    color: #000;
    background: #FFF;
}

* {
    box-sizing: border-box;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
fieldset,
input,
textarea,
p,
blockquote,
th,
td {
    margin: 0;
    padding: 0;
}

ol,
ul {
    list-style: none;
}

.header_nav .row div {
    padding-left: 0;
    &:last-child{
        padding-right: 0;
        ul li:last-child{
            width: 124px;
            height: 100%;
            text-align: center;
            background-color: #424242;
            a {
                line-height: 34px;
                padding-right: 0;
            }
        }
    }
    ul li {
        height: 40px;

        a {
            font-size: 12px;
            color: #B0B0B0;
            line-height: 40px;
            padding-top: 0;
            padding-bottom: 0;

            &:first-child {
                padding-left: 0;
            }
        }
    }
}

.header {
    width: 100%;
    height: 40px;
    background-color: #333333;
}

.bar {
    margin-top: 30px;
    div .bar_bottom div:first-child {
        padding-left: 0;
    }
    div .bar_bottom div:nth-child(2) {
        padding-right: 0;
        ul li a {
            line-height: 46px;
            font-size: 12px;
            color: #434A54;
            background: transparent;
            padding: 0 8px 0 8px;

        }
        ul li a.active{
            color: red;
        }
        ul span {
            font-size: 12px;
            color: #434A54;
            line-height: 46px;
            padding: 0 8px 0 8px;
        }

        ul button {
            background-color: #FF6700;
            color: #FFFFFF;
            width: 124px;
            height: 30px;
            border: 0;
            margin-top: 8px;
            margin-left: 41px;
            a {
                color: #fff;
                text-decoration: none;
            }
        }
    }

    div .bar_top {
        padding-bottom: 30px;
    }

    div .bar_top div:first-child {
        height: 58px;
        width: 58px;
        padding-left: 0;
        img {
            height: 100%;
            width: 58px;
        }
    }

    div .bar_top div:nth-child(2) {
        ul {
            height: 58px;
            line-height: 58px;
        }

        ul li a {
            font-size: 16px;
            color: #333333;
            padding-left: 10px;
            padding-right: 10px;
            padding-top: 0;
            padding-bottom: 0;
        }
    }

    div .bar_top div:nth-child(3) {
        position: relative;
        height: 58px;
        padding-top: 4px;
        padding-bottom: 4px;
        padding-right: 0;
        input {
            padding: 0;
            margin: 0;
            width: 220px;
            height: 50px;
            border: 1px solid #E0E0E0;
            padding-left: 10px;
        }

        button {
            position: absolute;
            top: 4px;
            left: 234px;
            width: 50px;
            height: 50px;
            padding: 0;
            border: 1px solid #E0E0E0;
            background-color: #FFFFFF;
            &:hover {
                background-color: #FF6700;
                color: #fff;
            }
        }
    }
    div .bar_paging div .bar_paging_one div div:nth-child(3) {
        position: relative;
        height: 673px;
        margin-top: 120px;
        h2 {
            position: absolute;
            font-size: 38px;
            color:  #666666;
            top: 140px;
            left: 60px;
        }
        p {
            position: absolute;
            font-size: 26px;
            color: #333333;
            top: 190px;
            left: 60px;
        }
        span {
            position: absolute;
            top: 269px;
            left: 60px;
            font-size: 16px;
            color: #555;
            &:nth-of-type(2) {
                top: 298px;
            }
            &:nth-of-type(3) {
                top: 327px;
            }
        }
    }
    div .bar_paging div .bar_paging_one div div:nth-child(1) {
        div div div.active {
            height: 764px;
        }
    }
    div .bar_paging div .bar_paging_one div div:nth-child(2) {
        position: relative;
         h2 {
             position: absolute;
            color: #666666;
            font-size: 40px;
            top: 70px;
        }
         p {
             position: absolute;
            color: #333333;
            font-weight: 700;
            font-size: 22px;
            top: 120px;
        }
         span {
            position: absolute;
            font-size: 12px;
            color: #555;
            top: 162px;
            &:last-child {
                top: 183px;
            }
        }
        height: 660px;
    }
    div .bar_paging div .bar_paging_two div div:nth-child(1) {
        img {
            margin-left: 90px;
        }
    }
    div .bar_paging div .bar_paging_two div div:nth-child(2) {
        height: 960px;
        position: relative;
        img {
            position: absolute;
            top: 170px;
            left: 630px;
        }
        p {
            position: absolute;
            width: 308px;
            color: #333333;
            font-size: 14px;
            line-height: 34px;
            top: 321;
            left: 110px;
        }
    }
    div .bar_paging div .bar_paging_two div div:nth-child(3) {
        height: 700px;
        position: relative;
        img {
            position: absolute;
            top: 171px;
            left: 44px;
        }
        h2 {
            position: absolute;
            color: #000;
            font-size: 26px;
            top: 52px;
            left: 65px;
        }
        span {
            position: absolute;
            color: #7B7B7B;
            font-size: 18px;
            top: 85px;
            left: 65px;
        }
        p {
            position: absolute;
            width: 394px;
            font-size: 12px;
            line-height: 32px;
            color: #333333;
            left: 804px;
            top: 244px;
        }
    }
    div .bar_paging div .bar_paging_three div .box{
        &::after{
            display: block;
            clear: both;
            content: '';
        }
        .left {
            float: left;
            width: 950px;
            height: 610px;
            img {
                width: 100%;
                height: 100%;
            }
        }
        .right {
            float: right;
            width: 174px;
            height: 610px;
            border-top: 1px solid #ccc;
            padding-top: 24px;
            img {
                height: 80px;
                width: 116px;
                margin-top: 12px;
                margin-left: 54px;
            }
        }
    }
}
.mainf{
    width: 1140px;
    margin: 0 auto;
    .flooter{
        .flooter_top{
            height: 82px;
            border-bottom: 1px solid #E0E0E0;
            ul {
                padding-top: 25px;
                &::after{
                    display: block;
                    clear: both;
                    content: '';
                }
                li {
                    float: left;
                    width: 228px;
                    height: 26px;
                    border-right: 1px solid #E0E0E0;
                    font-size: 18px;
                    color: #616161;
                    text-align: center;
                    line-height: 26px;
                    &:hover {
                        color: #FF6700;
                    }
                    &:last-child{
                        border: 0;
                    }
                    span {
                        font-size: 26px;
                    }
                }
            }
        }
        .flooter_bottom {
            height: 260px;
            &::after{
                display: block;
                clear: both;
                content: '';
            }
            .flooter_bottom_left{
                width: 912px;
                float: left;
                    padding-top: 40px;
                    &::after{
                        display: block;
                        clear: both;
                        content: '';
                    }
                    li{
                        float: left;
                        width: 152px;
                        h2{
                            font-size: 12px;
                            color: #424242;
                            margin-bottom: 21px;
                        }
                        p {
                            font-size: 12px;
                            color: #757575;
                            line-height: 28px ;
                        }
                    }
            }
            .flooter_bottom_right{
                width: 228px;
                float: left;
                margin-top: 40px;
                height: 110px;
                border-left: 1px solid #ccc;
                text-align: center;
                h2 {
                    font-size: 18px;
                    color: #FF6700;
                }
                p {
                    font-size: 12px;
                    color: #616161;
                    margin-top: 7px;
                    &:last-child{
                        font-size: 14px;
                        span {
                            font-size: 16px;
                        }
                    }
                }
                a {
                    display: block;
                    height: 30px;
                    width: 120px;
                    color: #FF6700;
                    text-align: center;
                    line-height: 30px;
                    border: 1px solid #FF6700;
                    margin-top: 5px;
                    margin-left: 52px;
                }
                
            }   
        }
    }
}